<script setup lang="ts">
import {ref} from 'vue'
  const arr = ref(['西瓜','苹果','香蕉','草莓'])

</script>
<template>
 <div>
  <h3>小黑水果店</h3>
  <!-- 
    ul 无序列表，前面有装饰小圆点
    ol 有序列表，前面有数字序号

    :key="item" 作用：给列表项添加唯一标识。便于Vue进行列表项的正确排序复用
  -->
  <ul v-for="(item,index) in arr" :key="index">
    <li>{{ item }}------------{{ index }}</li>
  </ul>

  <ol>
    <li v-for="item in arr" :key="item">
      {{ item }}
    </li>
  </ol>
  
  <ol>
    <li v-for="item in 5">测试结构</li>
  </ol>

  
 </div>
</template>
<style scoped>
  
</style>

